* {box-sizing: border-box;margin: 0;padding: 0;}body {font-family: Arial, sans-serif;background: #1e1e1e;color: white;}header { background: #222; display: flex; align-items: center; padding: 10px 20px; position: relative; z-index: 10;} .menu-toggle { font-size: 24px; cursor: pointer;margin-right: 15px; -webkit-tap-highlight-color: transparent;} .sidebar { position: fixed; top: 0; left: -250px; width: 250px; height: 100%; background: #333; color: white; transition: left 0.3s; padding: 20px; z-index: 1000;} .sidebar.active { left: 0;} .overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); display: none; z-index: 999;} .overlay.active { display: block;} .buttons { display: flex; gap: 10px; padding: 10px 20px;} .buttons.top-buttons { justify-content: flex-start;} .buttons.run-button { justify-content: center; padding-top: 15px;}button { padding: 8px 12px; cursor: pointer; border: none; background: #444; color: white;border-radius: 3px; -webkit-tap-highlight-color: transparent;}button.active { background: #1e90ff;}button-url { padding: 8px 12px; cursor: pointer; border: none; background: #444; color: white; font-family: bold;border-radius: 3px; -webkit-tap-highlight-color: transparent; }button-url:hover { background: #1e90ff;}.preview-screen { width: 100%; border: 2px solid #444; overflow: auto; background: white; margin: auto; border-radius: 5px;} .desktop-frame { width: 1024px; height: 600px;} .mobile-frame { width: 375px; height: 667px;}#url-input { flex: 1 1 30%; display: flex; flex-direction: column; background: white; border: 1px solid #555; border-radius: 5px;}@media (max-width: 768px) { .desktop-frame { width: 100%; max-width: 100%; height: 400px;} .mobile-frame { width: 375px; max-width: 100%; height: 667px;} .editor { flex: 1 1 100%; border-radius: 5px;} .editor textarea { height: 250px; border-radius: 5px;}} .tool-links { list-style: none; padding: 10px 0;} .tool-links li { margin-bottom: 8px;} .tool-links a { color: white; text-decoration: none; -webkit-tap-highlight-color: transparent;} .tool-links a:hover { text-decoration: none; color: #1e90ff;} .social-text { margin-top: 5px;} .social-icons { display: flex; gap: 10px;margin-top: 10px; -webkit-tap-highlight-color: transparent;} .social-icons svg { transition: transform 0.2s;} .social-icons a:hover svg { transform: scale(1.2);} .site-footer {background: #222; padding: 20px; text-align: center; color: #ccc; margin-top: 30px; border-top: 1px solid #444;} .site-footer a { color: #aaa; text-decoration: none;margin: 0 8px; -webkit-tap-highlight-color: transparent;} .site-footer a:hover { text-decoration: none; color: #1e90ff;} .footer-copy { margin-top: 10px; font-size: 14px;}}